import React, { useState } from 'react';
import useCounter from "../../utils/usecount";
import { Button, Flex } from 'antd';
import style from "./index.module.css";
const imgUrl = new URL('../../assets/images/10.jpg', import.meta.url).href
// import imgUrl from "../../assets/images/10.jpg";

import "./index.css";
// 自定义Hook  
// function useCounter(initialValue = 0) {
//   const [count, setCount] = useState(initialValue);

//   const increment = () => {
//     setCount(count + 1);
//   };

//   const decrement = () => {
//     setCount(count - 1);
//   };

//   return [count, increment, decrement];
// }

function getImageUrl(name: any) {
  return new URL(`../../assets/images/${name}`, import.meta.url).href
}

function Index() {

  const [count, increment, decrement, data]: any = useCounter(10);




  return (

    <div className={style.box}>
      <p>Count: {count}</p>
      <button onClick={increment}>加</button>
      <button onClick={decrement}>减</button>
      {/* <Button type="primary" className={style.btn}>Primary Button</Button> */}
      <img src="/src/assets/images/10.jpg" alt="错误" />
      <img src={imgUrl} alt="错误" />
      <img src={getImageUrl('10.jpg')} alt="错误" />
      <img src={getImageUrl('img1.png')} alt="错误" />
      <p>{import.meta.env.VITE_TITLE}</p>
    </div>
  )
}

export default Index

